<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/common.css" />
		<style type="text/css">
			body,
			.mui-content {
				background-color: #FFFFFF;
				margin: 15px;
			}
			
			.mui-row {
				background-color: #FFFFFF;
				text-align: center;
			}
			
			.mui-col-xs-12 img {
				width: 80%;
			}
			
			.mui-col-xs-4 {
				margin: 5px 0;
			}
			
			.mui-col-xs-4 img {
				width: 100%;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-back mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">热门服务</h1>
		</header>
		<div class="mui-content">
			<div class="mui-row">
				<div class="mui-col-xs-12">
					<img src="../images/artshow/jiuba.jpg" id="3"/>
				</div>
			</div>
			<div class="mui-row">
				<div class="mui-col-xs-4">
					<img src="../images/artshow/canting.jpg" id="5"/>
				</div>
				<div class="mui-col-xs-4">
					<img src="../images/artshow/hunli.jpg" id="9"/>
				</div>
				<div class="mui-col-xs-4">
					<img src="../images/artshow/luzhi.jpg" id="11"/>
				</div>
			</div>
			<div class="mui-row">
				<div class="mui-col-xs-4">
					<img src="../images/artshow/juchang.jpg" id="14"/>
				</div>
				<div class="mui-col-xs-4">
					<img src="../images/artshow/kaiye.jpg" id="6"/>
				</div>
				<div class="mui-col-xs-4">
					<img src="../images/artshow/nianhui.jpg" id="7"/>
				</div>
			</div>
			<div class="mui-row">
				<div class="mui-col-xs-4">
					<img src="../images/artshow/paishe.jpg" id="10"/>
				</div>
				<div class="mui-col-xs-4">
					<img src="../images/artshow/shengri.jpg" id="8"/>
				</div>
				<div class="mui-col-xs-4">
					<img src="../images/artshow/xuanchuanpian.jpg" id="12"/>
				</div>
			</div>
			<div class="mui-row">
				<div class="mui-col-xs-4">
					<img src="../images/artshow/huzhu.jpg" id="15"/>
				</div>
			</div>
		</div>
	</body>
	<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/common.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		mui.plusReady(function() {
			var artshowFilter = Common.defaultArtshowFilter;
			var indexPage = plus.webview.getLaunchWebview();
			// 点击演艺分类进入演艺列表页
			mui('.mui-content').on('tap', 'img', function() {
				plus.nativeUI.showWaiting();
				artshowFilter.type = Number(this.id);
				plus.storage.setItem('artshowFilter', JSON.stringify(artshowFilter));
				setTimeout(function() {
					plus.nativeUI.closeWaiting();
					mui.back();
					mui.fire(indexPage, 'goTab', {
						targetTab: 　 'artshow',
						type : 'artshowFilter'
					})
				}, 500)
			})
		})
	</script>

</html>